<template>
	<view>
		<Header title="通知公告" :showBack="true"></Header>
		<view class="notice-list">
			<view class="ellipsis" v-for="(item, index) in noticeList" :key="index" @click="navAdverseDetails(item.id)">
			<uni-icons class="icon" type="sound" color="#cfb787" size="12"></uni-icons>{{item.title}}</view>
		</view>
	</view>
</template>

<script>
	import Header from '@/components/header.vue'
	export default {
		components: {
			Header
		},
		data() {
			return {
			   noticeList: [],
			   page: 1
			}
		},
		onLoad() {
			let that = this;
			that.http.httpRequest('/notice/index','post',{ page: this.page}).then(res => {
				this.noticeList = res.data.data
			}) 	
		},
		onReachBottom() {
		  this.getMore()
		},
		methods: {
		  // 获取更多公告
		  getMore () {
			  this.page++
			  uni.showLoading({
			  	title: '加载下一页'
			  })
			 let that = this;
			 that.http.httpRequest('/notice/index','post',{ page: this.page}).then(res => {
			 	if (res.data.data.length == 0) {
					this.toast('没有更多数据了')
					uni.hideLoading()
				}
				this.noticeList = [...this.noticeList, ...res.data.data]
				uni.hideLoading()
			 }) 	 
		  },
		  // 查看消息详情
		  navAdverseDetails(id) {
		  	uni.navigateTo({
		  		url: '../message/messageDetail/messageDetail?id=' + id
		  	})
		  },
		}
	}
</script>

<style lang="scss" scoped>
.notice-list {
	padding: 0 50upx;
	line-height: 64upx;
	color: #666666;
	.icon {
		margin-right: 16upx;
	}
	.ellipsis {
		border-bottom: 1rpx solid #efefef;
	}
}
</style>
